<template>
	<view class="container">
		<uni-nav-bar @clickLeft="back" leftIcon="back" :fixed="true" status-bar="true" :title="title"></uni-nav-bar>
		<view class="step">
			<radio-group class="radioGroup" @change="radioChange1" v-if="!type">
				<label class="radio">
					<radio color="#57BE6A" :value="1" :checked="type1" />企业自营</label>
				<label class="radio">
					<radio color="#57BE6A" :value="2" :checked="type2" />社区直营</label>
			</radio-group>
			
			<!-- <radio-group class="jifenGroup mtop-50" @change="radioChange3" v-if="!type&&data.is_open_offline == 1">
				<label class="radio">
					<radio color="#57BE6A" value="1" :checked="type3" />分润模式</label>
				<label class="radio">
					<radio color="#57BE6A" value="2" :checked="type4" />分享模式</label>
			</radio-group>
			<radio-group class="jifenGroup mtop-50" @change="radioChange3" v-if="type&&sellerType == 'offline'">
				<label class="radio">
					<radio color="#57BE6A" value="1" :checked="type3" />分润模式</label>
				<label class="radio">
					<radio color="#57BE6A" value="2" :checked="type4" />分享模式</label>
			</radio-group> -->
		</view>
		<view class="cut"></view>
		<form class="formBox">
			<view class="label">商户模式修改请联系客服</view>
			<!-- 线下商户信息 -->
			<view class="uni-form-item uni-column" v-if="is_open_offline">
				<view class="title bold">线下商户</view>
				<view class="title">线下商户名称
					<image @tap.stop="markTips(1)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" v-model="data.seller_name" placeholder="请输入线下商户名称" />
			</view>
			<view class="uni-form-item uni-column" @tap="cateId" v-if="is_open_offline">
				<view class="title">经营品类
					<image @tap.stop="markTips(4)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" v-model="catename" disabled="true" placeholder="请选择经营品类" />
				<text class="cell-more yticon icon-you"></text>
			</view>
			<view class="uni-form-item uni-column" v-if="is_open_offline">
				<view class="title">线下服务电话
					<image @tap="markTips(5)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input type="number" class="uni-input" v-model="data.phone" placeholder="请输入线下服务电话" />
			</view>
			<view class="uni-form-item uni-column" v-if="is_open_offline">
				<view class="title">营业时间</view>
				<view class="timeBox">
					<input @tap="time1" class="uni-input time" disabled="true" placeholder="请选开始时间" v-model="timeG.time1" />
					<text>—</text>
					<input @tap="time2" class="uni-input time" disabled="true" placeholder="请选结束时间" v-model="timeG.time2" />
				</view>
			</view>
			<view class="uni-form-item uni-column" v-show="is_open_offline&&type&&data.shop_commission_retrun_mode == 1">
				<view class="title">最低优惠力度（给消费者）
					<image @tap="markTips(8)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" type="digit" placeholder="请输入优惠比例" v-model="data.rebate_proportion" />
				<text class="cell-more" style="color: #333;">%</text>
				<text class="label">企业自营优惠比例不低于{{company_sign_ratio}}%，社区直营优惠比例不低于{{community_ratio_limit}}%</text>
			</view>
			<view class="uni-form-item uni-column" style="margin-top:30rpx" v-if="is_open_offline">
				<view class="title bold">商户LOGO</view>
				<image class="image logo" :src="urls[0]" @click="clk(0)"></image>
				<text class="example-r" @tap="preViewExam(0)">查看示例</text>
			</view>
			<view class="uni-form-item uni-column" v-if="is_open_offline">
				<view class="title bold">门店主图</view>
				<image class="image logo" :src="urls[1]" @click="clk(1)"></image>
				<text class="example-r" @tap="preViewExam(1)">查看示例</text>
			</view>
			<view class="uni-form-item uni-column" v-if="is_open_offline">
				<view class="title bold">门店图片</view>
				<image class="image detailImg" :src="data.detail_image[0]" mode="aspectFit" @tap="upload_img(1,0)"></image>
				<image class="image detailImg" :src="data.detail_image[1]" mode="aspectFit" @tap="upload_img(1,1)"></image>
				<image class="image detailImg" :src="data.detail_image[2]" mode="aspectFit" @tap="upload_img(1,2)"></image>
				<text class="example-b" @tap="preViewExam(2)">查看示例</text>
			</view>
			<view class="cut" style="margin-top: 50rpx;" v-if="is_open_offline"></view>
			<!-- 线上商户信息 -->
			<view class="uni-form-item uni-column" v-if="is_open_online">
				<view class="title bold">线上商户</view>
				<view class="title">线上商户名称
					<image @tap.stop="markTips(1)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" v-model="data.online_name" placeholder="请输入线上商户名称" />
			</view>
			<view class="uni-form-item uni-column" v-if="is_open_online">
				<view class="title">线上服务电话
					<image @tap="markTips(6)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input type="number" class="uni-input" v-model="data.online_phone" placeholder="请输入线上服务电话" />
			</view>
			<!-- <view class="uni-form-item uni-column" v-show="is_open_online">
				<view class="title">退货收货人</view>
				<input type="text" class="uni-input" v-model="data.receive_name" placeholder="请输入退货收货人姓名" />
			</view>
			<view class="uni-form-item uni-column" v-show="is_open_online">
				<view class="title">退货收货人电话</view>
				<input type="number" class="uni-input" v-model="data.receive_phone" placeholder="请输入退货收货人电话" />
			</view>
			<view class="uni-form-item uni-column" v-show="is_open_online">
				<view class="title">退货收货地址</view>
				<input type="text" class="uni-input" v-model="data.receive_address" placeholder="请输入退货收货地址" />
			</view> -->
			<view class="uni-form-item uni-column" v-if="is_open_online">
				<view class="title bold">线上店招</view>
				<image class="image logo" :src="urls[2]" @click="clk(2)"></image>
				<text class="example-r" @tap="preViewExam(0)">查看示例</text>
			</view>
			<view class="cut" style="margin-top: 50rpx;" v-if="is_open_online"></view>
			<!-- 线上线下共同信息 -->
			<view class="uni-form-item uni-column" @tap="storeLocation" v-if="!type">
				<view class="title">商户位置
					<image @tap.stop="markTips(2)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" disabled="true" v-model="addressG.address1" placeholder="请选择商户位置" />
				<text class="cell-more yticon icon-you"></text>
			</view>
			<view class="uni-form-item uni-column" v-if="!type">
				<view class="title">商户详细地址
					<image @tap="markTips(3)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" v-model="addressG.address2" placeholder="请输入详细地址" />
			</view>
			<view class="uni-form-item uni-column" v-if="!type">
				<view class="title">社会统一信用代码
					<image @tap="markTips(7)" class="mark-img" src="/static/images/center/icon/5.png" mode=""></image>
				</view>
				<input class="uni-input" placeholder="请输入社会统一信用代码" v-model="data.unified_credit_code" />
			</view>
			<view class="uni-form-item uni-column" v-if="!type">
				<view class=" bold">营业执照</view>
				<image class="image licenseImg" :src="data.business_license" mode="aspectFit" @tap="upload_img(2,0)"></image>
				<text class="example-b" @tap="preViewExam(3)">查看示例</text>
			</view>
			<view class="uni-form-item uni-column">
				<view class="bold">特殊资质</view>
				<block v-for="(item,index) in data.quarantine_report" :key="index">
					<image class="image licenseImg" :src="item" mode="aspectFit" @tap="upload_img(3,index)"></image>
				</block>
				<view class="image licenseImg" @tap="upload_img(3)"></view>
				<text class="example-b" @tap="preViewExam(4)">查看示例</text>
			</view>
			<view class="uni-btn-v">
				<button @tap="submit">提 交</button>
			</view>
		</form>
		<!-- 图片剪切 -->
		<avatar @upload="myUpload" ref="avatar"></avatar>

		<category @select="select" @back="cateback" :show="categoryShow"></category>
		<w-picker :value="timeG.time1" mode="time" @confirm="onConfirm1($event)" ref="time1"></w-picker>
		<w-picker :value="timeG.time2" mode="time" @confirm="onConfirm2($event)" ref="time2"></w-picker>
		<view class="mark-tips-model" v-show="markTipsModel">
			<view :class="showType == 0 ? 'box' : 'box-type'">
				<image class="back" src="https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-08/c0fa520200821113311780.png"
				 mode=""></image>
				<text>说明</text>
				<view class="mark-con">
					<image class="bell" src="https://puhuishequ.oss-cn-beijing.aliyuncs.com/attach/2020-07/f10c1202007061012119827.png"
					 mode=""></image>
					<view class="mark">
						<block v-if="showType==1">填店铺名称，勿填公司全称</block>
						<block v-else-if="showType==2">地图定位，范围需精准到社区街道名称</block>
						<block v-else-if="showType==3">文字填写精确地址，需准确到店铺门牌号</block>
						<block v-else-if="showType==4">需要选择与实际销售经营产品一致的类别，如无法确定类别，先选择其它</block>
						<block v-else-if="showType==5">需要填写店铺管理员联系方式，不一定是法人信息</block>
						<block v-else-if="showType==6">需要填写店铺管理员联系方式，不一定是法人信息</block>
						<block v-else-if="showType==7">需要填写企业营业执照编码</block>
						<block v-else-if="showType==8">例如：商户优惠比例为 5%。消费者实际消 费支付 100 元，商家实际获得收入 95 元，优惠的 5 元将以贝壳的形式赠送部分到用户账户。</block>
						<block v-else-if="showType==9">用户退货需填写收货人,请正确填写</block>
						<block v-else-if="showType==10">用户退货需填写收货人电话,请正确填写</block>
						<block v-else-if="showType==11">用户退货需填写收货地址,请正确填写</block>
					</view>
				</view>
				<view class="mark-btn" @tap.stop="markTipsModel = !markTipsModel">我知道了</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		baseUrl
	} from "@/api/api.js"
	import {
		getsellerclass,
		merchantEntry,
		changeinfo,
		sellerIndex
	} from "@/api/merchant.js"
	import {
		systemConfig,
		location
	} from '@/api/public.js'
	import category from "@/components/category/category.vue"
	import wPicker from "@/components/w-picker/w-picker.vue"
	import avatar from "@/components/yq-avatar/yq-avatar.vue"
	export default {
		components: {
			avatar,
			wPicker,
			category
		},
		data() {
			return {
				title: "",
				type: false,
				sellerType: "",
				urls: ["", ""],
				baseUrl: "",
				imgType: null,
				url: "",
				maxWidth: null,
				maxHeight: null,
				current: 0,
				addressG: {
					address1: null,
					address2: null,
				},
				timeG: {
					time1: null,
					time2: null,
				},
				cateList: [],
				catename: "",
				data: {
					online_logo: null,
					online_name: null,
					online_phone: null,
					seller_name: null,
					cate_id: null,
					logo: null,
					phone: null,
					image: null,
					detail_image: ['', '', ''],
					quarantine_report: [],
					business_license: null,
					unified_credit_code: null,
					seller_type: "1",
					bank_card_number: null,
					longitude: null,
					latitude: null,
					province: null,
					city: null,
					area: null,
					address: null,
					business_hours: null,
					is_open_offline: null,
					is_open_online: null,
					modify_seller_type: 3,
					shop_commission_retrun_mode: 1
				},
				categoryShow: false,
				is_open_online: false,
				is_open_offline: false,
				type1: true,
				type2: false,
				type3: true,
				type4: false,
				company_sign_ratio: "",
				community_ratio_limit: "",
				exampleImage: [
					'https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-07/ffd2c202007241702482961.png', //logo
					'https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-07/5a0e12020072418122613.png', //门店主图
					'https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-07/e47b1202007241818424266.png', //门店图片
					'https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-07/5e7af202007241817121636.png', //营业执照
					'https://inclusivecommunity.oss-cn-chengdu.aliyuncs.com/attach/2020-07/6006b202007241819486863.png', //特殊资质
				],
				showType: 0,
				markTipsModel: false,

			}
		},
		onLoad(option) {
			if (option.type == "online" || option.type == "offline") {
				this.sellerType = "offline"
				this.type = true
			} else {
				this.type = false
			}
			systemConfig({
				filed: 'company_sign_ratio'
			}).then(res => {
				this.company_sign_ratio = res.msg;
			})
			systemConfig({
				filed: 'community_ratio_limit'
			}).then(res => {
				this.community_ratio_limit = res.msg;
			})
			sellerIndex().then(res => {
				let data = res.data.seller_info;
				data.quarantine_report = JSON.parse(data.quarantine_report);
				if (data.detail_image) {
					data.detail_image = JSON.parse(data.detail_image);
				} else {
					data.detail_image = ['', '', '']
				}
				this.data = data
				if (option.type == 'offline') {
					this.data.modify_seller_type = 2
					this.is_open_offline = true
					this.data.is_open_offline = 1
					this.data.is_open_online = 1
					this.title = "开通线下商户"
				} else if (option.type == 'online') {
					this.data.modify_seller_type = 1
					this.is_open_online = true
					this.data.is_open_online = 1
					this.data.is_open_offline = 1
					this.title = "开通线上商城"
				} else if (option.type == 'change') {
					this.data.modify_seller_type = 3
					this.data.is_open_offline = data.is_open_offline;
					this.data.is_open_online = data.is_open_online;
					this.is_open_offline = data.is_open_offline == 1 && data.verify_status == 1 ? true : false
					this.is_open_online = data.is_open_online == 1 && data.online_verify_status == 1 ? true : false
					this.title = "修改商户信息"
				}
				data.seller_type == 1 ? this.type1 = true : (this.type2 = true, this.type1 = false)
				data.shop_commission_retrun_mode == 1 ? this.type1 = true : (this.type4 = true, this.type3 = false)
				if (data.business_hours) {
					let timeArr = data.business_hours.split('-');
					this.timeG.time1 = timeArr[0];
					this.timeG.time2 = timeArr[1];
				}
				this.urls[0] = data.logo
				this.urls[1] = data.image
				this.urls[2] = data.online_logo
				if (data.latitude && data.longitude) {
					uni.request({
						header: {
							"Content-Type": "application/text"
						},
						url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + data.latitude + ',' + data.longitude +
							'&key=7YDBZ-PZSWP-7UCDU-LMHBU-QSTXQ-W2FEO',
						success: (re) => {
							this.addressG.address1 = re.data.result.address;
							this.addressG.address2 = data.address.split(this.addressG.address1)[1]
						}
					})
				}
			})
			this.baseUrl = baseUrl()
			getsellerclass().then(res => {
				this.cateList = res.data.seller_class
				res.data.seller_class.map((val, key) => {
					if (val.son) {
						val.son.map((val2, key2) => {
							if (val2.sc_id == this.data.cate_id) {
								this.catename = val2.sc_name;
								return
							}
						})
					} else {
						if (val.sc_id == this.data.cate_id) {
							this.catename = val.sc_name;
							return
						}
					}
				})
			})
		},
		watch: {
			addressG: {
				deep: true,
				handler(val, oldval) {
					this.addressC();
				}
			},
			timeG: {
				deep: true,
				handler(val, oldval) {
					this.timeC();
				}
			}
		},
		methods: {
			markTips(type) {
				this.showType = type
				this.markTipsModel = !this.markTipsModel;
			},
			preViewExam(id) {
				uni.previewImage({
					urls: this.exampleImage,
					current: id,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {},
						fail: function(err) {}
					}
				});
			},
			back() {
				uni.navigateBack({

				})
			},
			myUpload(rsp) {
				this.$set(this.urls, rsp.index, rsp.path);
				let _this = this
				let token = uni.getStorageSync("Authori-zation");
				uni.showLoading({
					mask:true
				})
				uni.uploadFile({
					// 需要上传的地址
					url: _this.baseUrl + "/upload/image",
					header: {
						"Authori-zation": "Bearer " + token
					},
					// filePath  需要上传的文件
					filePath: rsp.path,
					name: "file",
					success(_res) {
						uni.hideLoading()
						var res = JSON.parse(_res.data);
						if (_res.statusCode === 200 && res.status === 200) {
							if (rsp.index == 0) {
								_this.data.logo = res.data.url
							} else if (rsp.index == 1) {
								_this.data.image = res.data.url
							} else if (rsp.index == 2) {
								_this.data.online_logo = res.data.url
							}

						} else {
							uni.showToast({
								icon: "none",
								title: "上传失败"
							});
						}
					}
				});
			},
			clk(index) {
				this.$refs.avatar.fChooseImg(index, {
					selWidth: "500upx",
					selHeight: "500upx",
					expWidth: '500upx',
					expHeight: '500upx',
					inner: index ? 'true' : 'false'
				});
			},
			timeC() {
				this.data.business_hours = this.timeG.time1 + '-' + this.timeG.time2
			},
			addressC() {
				this.data.address = this.addressG.address1 + this.addressG.address2
			},
			cateId() {
				this.categoryShow = true
			},
			select(e) {
				let _this = this
				this.catename = e.name
				this.data.cate_id = e.id
				this.categoryShow = false
			},
			cateback(e) {
				this.categoryShow = e
			},
			storeLocation() {
				let _this = this
				// #ifdef MP-WEIXIN
				uni.authorize({
					scope: 'scope.userLocation',
					success() {
						uni.chooseLocation({
							success: function(res) {
								uni.request({
									header: {
										"Content-Type": "application/text"
									},
									url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + res.latitude + ',' + res.longitude +
										'&key=7YDBZ-PZSWP-7UCDU-LMHBU-QSTXQ-W2FEO',
									success(re) {
										_this.addressG.address1 = re.data.result.address
										_this.data.province = re.data.result.address_component.province
										_this.data.city = re.data.result.address_component.city
										if (re.data.result.address_component.district) {
											_this.data.area = re.data.result.address_component.district
										} else {
											_this.data.area = re.data.result.address_component.street
										}

										_this.data.longitude = re.data.result.location.lng
										_this.data.latitude = re.data.result.location.lat
									}
								});
							}
						});
					},
					fail() {
						uni.showModal({
							content: "检测到您没打开此小程序的定位权限，是否去设置打开？",
							confirmColor: "#57BE6A",
							success: function(res) {
								if (res.confirm) {
									uni.openSetting({
										success: (res) => {}
									})
								} else if (res.cancel) {

								}
							}
						})
					}
				})
				// #endif
				// #ifdef APP-PLUS
				uni.chooseLocation({
					success: function(res) {
						uni.request({
							header: {
								"Content-Type": "application/text"
							},
							url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + res.latitude + ',' + res.longitude +
								'&key=7YDBZ-PZSWP-7UCDU-LMHBU-QSTXQ-W2FEO',
							success(re) {
								_this.addressG.address1 = re.data.result.address
								_this.data.province = re.data.result.address_component.province
								_this.data.city = re.data.result.address_component.city
								if (re.data.result.address_component.district) {
									_this.data.area = re.data.result.address_component.district
								} else {
									_this.data.area = re.data.result.address_component.street
								}

								_this.data.longitude = re.data.result.location.lng
								_this.data.latitude = re.data.result.location.lat
							}
						});
					}
				});
				// #endif
				// #ifdef H5
				uni.chooseLocation({
					success: function(res) {
						location({
							address: "",
							latitude: res.latitude,
							longitude: res.longitude
						}).then(re => {
							_this.addressG.address1 = re.data.location.address
							_this.data.province = re.data.location.address_component.province
							_this.data.city = re.data.location.address_component.city
							if (re.data.location.address_component.district) {
								_this.data.area = re.data.location.address_component.district
							} else {
								_this.data.area = re.data.location.address_component.street
							}

							_this.data.longitude = re.data.location.location.lng
							_this.data.latitude = re.data.location.location.lat
						})
					}
				});
				// #endif
			},
			upload_img(type, ind) {
				let _this = this;
				let token = uni.getStorageSync("Authori-zation");
				uni.chooseImage({
					count: 1,
					sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ["album"], //从相册选择
					success: function(res) {
						uni.showLoading({
							mask:true,
							title: "上传中"
						})
						//因为有一张图片， 输出下标[0]， 直接输出地址
						var imgFiles = res.tempFilePaths[0];
						//#ifdef H5
						utils.imgCompress(imgFiles).then(re => {
							imgFiles = re
							//#endif
							uni.uploadFile({
								// 需要上传的地址
								url: _this.baseUrl + "/upload/image",
								header: {
									"Authori-zation": "Bearer " + token
								},
								// filePath  需要上传的文件
								filePath: imgFiles,
								name: "file",
								success(_res) {
									uni.hideLoading()
									var res = JSON.parse(_res.data);
									if (_res.statusCode === 200 && res.status === 200) {
										if (type == 1) {
											_this.data.detail_image.splice(ind, 1, res.data.url)
										} else if (type == 2) {
											_this.data.business_license = res.data.url
										} else if (type == 3) {
											if (ind == undefined) {
												let length_index = _this.data.quarantine_report.length;
												_this.data.quarantine_report.splice(length_index, 1, res.data.url)

											} else {
												_this.data.quarantine_report.splice(ind, 1, res.data.url)
											}
										}
									} else {
										uni.showToast({
											title: "上传失败"
										});
									}
								}
							});
							//#ifdef H5
						})
						//#endif
					}
				});
			},
			radioChange1(e) {
				this.data.seller_type = e.target.value
			},
			radioChange3(evt) {
				this.data.shop_commission_retrun_mode = evt.target.value
			},
			checkChange(e) {
				let arr = e.detail.value;
				if (arr.indexOf('1') != -1) {
					this.is_open_offline = true;
				} else {
					this.is_open_offline = false;
				}
				if (arr.indexOf('2') != -1) {
					this.is_open_online = true;
				} else {
					this.is_open_online = false;
				}
			},
			time1() {
				this.$refs.time1.show()
			},
			time2() {
				this.$refs.time2.show()
			},
			onConfirm1(e) {
				this.timeG.time1 = e.value
			},
			onConfirm2(e) {
				this.timeG.time2 = e.value
			},
			submit() {
				uni.showLoading({
					mask:true
				})
				changeinfo(this.data).then(res => {
					uni.hideLoading()
					if (res.status == 200) {
						uni.showToast({
							duration: 1500,
							title: res.msg,
							icon: 'none'
						});

						setTimeout(function() {
							uni.navigateBack()
							//申请修改商户 审核期间不允许操作商户
							// uni.navigateTo({
							// 	url: "/pages/index/index?current=4"
							// })
						}, 1500)
					}
				})
				// 				merchantEntry(this.data).then(res => {// 				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		font-size: 14px;
		line-height: 24px;

		.step {

			.jifenGroup,
			.radioGroup {
				display: flex;
				justify-content: space-around;
				align-items: center;
				margin: 40rpx 0;
			}
		}

		.cut {
			width: 750rpx;
			height: 20rpx;
			background-color: #eee;
		}
		.formBox{
			.label{
				margin: 20rpx 60rpx 0;
				background: #FFFDF5;
				border-radius: 4rpx;
				color: #9D998B;
				font-size: 30rpx;
				padding: 0 20rpx;
			}
		}

		.uni-column {
			padding: 0 60rpx;
			padding-top: 24rpx;
			position: relative;

			.title {
				font-size: 28rpx;
				line-height: 60rpx;
				color: #333333;
			}

			.bold {
				font-size: 32rpx;
				margin-bottom: 10rpx;
			}

			.cell-more {
				position: absolute;
				right: 70rpx;
				bottom: 5rpx;
				color: #e5e5e5;
			}

			.label {
				position: absolute;
				color: red;
				font-size: 20rpx;
				bottom: -50rpx;
			}

			.uni-input {
				font-size: 24rpx;
				color: #999999;
				height: 50rpx;
				line-height: 50rpx;
				border-bottom: 1rpx solid #f5f5f5;
			}

			.timeBox {
				display: flex;
				justify-content: space-between;

				.time {
					width: 250rpx;
				}

				text {
					color: #999;
				}
			}


			.image {
				background: url(../../static/images/public/imgUpload.png) no-repeat center center;
				background-size: 90rpx 90rpx;
				border-radius: 10rpx;
				border: 1px solid rgba(238, 238, 238, 1);
			}

			.logo {
				width: 250rpx;
				height: 250rpx;
			}

			.headImg {
				width: 250rpx;
				height: 250rpx;
			}

			.detailImg {
				width: 630rpx;
				height: 300rpx;
			}

			.licenseImg {
				width: 630rpx;
				height: 300rpx;
			}

			.example-r {
				display: inline-block;
				text-align: center;
				width: 180rpx;
				height: 70rpx;
				line-height: 70rpx;
				background-color: #57be6a;
				border-radius: 18rpx;
				color: #fff;
				font-size: 24rpx;
				position: relative;
				bottom: 30rpx;
				left: 15rpx;
			}

			.example-b {
				background-color: #57be6a;
				border-radius: 18rpx;
				display: inline-block;
				text-align: center;
				width: 180rpx;
				height: 70rpx;
				line-height: 70rpx;
				color: #fff;
				font-size: 24rpx;
				display: block;
				margin: 25rpx 0;
			}

			.mark-img {
				width: 40rpx;
				height: 40rpx;
				position: relative;
				top: 10rpx;
				left: 20rpx;
			}
		}
	}

	.uni-btn-v {
		width: 90%;
		margin: 0 auto;

		// margin-bottom: 30rpx;
		button {
			background-color: $theme-color;
			color: #fff;
			width: 100%;
			height: 80rpx;
			border-radius: 40rpx;
			margin: 80rpx 0;
			line-height: 80rpx;
			font-size: 32rpx;
			font-weight: bold;
		}
	}

	.meslist_canvas {
		position: fixed;
		top: 0;
		width: 200px;
		height: 200px;
		visibility: hidden;
	}

	.sellerType {
		width: 630rpx;
		background-color: #fff;
		border-radius: 8rpx;
		padding: 0 30rpx;

		.uni-list-cell {
			display: flex;
			justify-content: space-between;
			line-height: 100upx;
		}

		.uni-list-cell:nth-of-type(1) {
			border-bottom: 1rpx solid #f5f5f5;
		}
	}

	.cateId {
		width: 100vw;
		height: 100vh;
		box-sizing: border-box;
		background-color: #fff;
		display: flex;
		align-content: flex-start;
		flex-wrap: wrap;

		.item {
			margin-top: 40rpx;
			width: 250rpx;
			height: 200rpx;
			align-items: center;
			text-align: center;

			image {
				margin: 0 auto;
				width: 160rpx;
				height: 160rpx;
				display: block;
			}

			text {
				margin-top: 10rpx;
				line-height: 30rpx;
			}
		}
	}
</style>
